<template>
	<view class="tn-safe-area-inset-bottom">
		<view class="tn-classify__search--wrap">
			<view class="tn-color-gray--dark "
				style="margin: 20rpx 30rpx 0rpx 30rpx;border-radius: 100rpx;padding-left: 6rpx;background-color: rgba(248, 247, 248, 0.9);">
				<view class="tn-padding-xs">
					<tn-input v-model="search.name" placeholder="请搜索"  @blur="getGetenterprisePolicy()" />
				</view>
		
			</view>
		</view>
		<view class="tn-info__container tn-margin-left tn-margin-right">
			<view v-for="(item,index) in list" :key="index" class="tn-flex tn-margin-top-sm tn-flex-col-center box" @click="navDetails(item)">
				<view class="left">
					<image :src="item.cover" ></image>
				</view>
				<view class="tn-margin-left-sm">
					<view class="tn-text-lg">
						{{item.name}}
					</view>
					<view class="tn-text-sm tn-margin-top-sm">
						<view class="">规 模: {{item.subtitle}}</view>
					</view>
					<view class="tn-text-sm tn-margin-top-sm">
						<view class="">面 积: {{item.area}}㎡</view>
					</view>
					<view class="tn-text-sm  tn-margin-top-sm tn-flex">
						月 租:
						<view class="price">{{item.monthlyRent}}元/月</view>
					</view>
				</view>
		   </view>
		</view>
		
	</view>
</template>

<script>
	import {
		GetunleasedHouse
	} from '@/api/house/index'

	export default {
		data() {
			return {
				name: '',
				list: [],
				page: 1,
				row: 10,
				total: ""
			}
		},
		onShow() {
			this.getunleasedHouse()
		},
		onReachBottom() {
			if (this.total <= this.list.length) {
				uni.showToast({
					title: "数据已经到底啦",
					icon: 'none',
					duration: 2000
				})
				return
			}
			this.page++
			this.getunleasedHouse()
		},
		methods: {
			navDetails(item) {
				uni.navigateTo({
					url: `/subcontract/house/details?id=${item.id}`
				});
			},
			getunleasedHouse() {
				let obj = {
					name: this.name,
					page: this.page,
					row: this.row
				}
				uni.showLoading({
					title: '加载中'
				})
				GetunleasedHouse(obj).then((res) => {
					if (this.page !== 1) {
						this.list = this.list.concat(res.data)
					} else {
						this.list = res.data
					}
					console.log(this.list);
					this.total = res.total
					uni.hideLoading();
				}, error => {
					uni.hideLoading();
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.box{
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	padding: 20rpx;
	min-height: 250rpx;
	.left{
		width:250rpx;
		height: 250rpx;
		image{
		width:250rpx;
	    height:100%;
		}
	}
	}
	.price{
		color:red;
	}
</style>
